<template>
  <div class="areanoPage">
    <el-table
    :data="areaList"
    style="width: 100%; overflow-y: auto;"
    height="520"
    row-key="areaid"
    lazy
    :load="load"
    :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
    <el-table-column
      prop="areaname"
      label="地区名称"
      >
    </el-table-column>
    <el-table-column
      prop="areaid"
      label="地区ID"
      >
    </el-table-column>
    <el-table-column
      align="center"
      prop="provincecode"
      label="省份code">
    </el-table-column>
    <el-table-column
      label=创建日期>
        <template slot-scope="scope">
          {{scope.row.createtime | timeFormat}}
        </template>
    </el-table-column>
  </el-table>  
  </div>
</template>

<script>
import { commonGetAreaList,commonGetAreaListByPid } from '../../../service/common'
export default {
  data() {
    return {
      areaList:[]
    }
  },
  created() {
    this.getAreaList()
  },
  methods: {
    // 获取省份
    async getAreaList() {
      let i = 1
      const res = await commonGetAreaList()
      if (res.code == '200') {
       res.pageInfo.forEach(item => {
          // item['id'] = i
          item['hasChildren'] = true
          // i++
          return item
        })
        console.log(res.pageInfo,'commonGetAreaList地区返回res.pageInfo')
        this.areaList = res.pageInfo
      }
    },
    // 根据id获取省份
    async load(tree, treeNode, resolve) {
      console.log(tree,'tree')
      let param = {
        "provincecode":tree.provincecode,
        "type": tree.type + 1
      }
      const res = await commonGetAreaListByPid(param)
      console.log(res,'子节点res')
      res.pageInfo.forEach(item => {
        if(item.type <= 1) {
          item['hasChildren'] = true
         // i++
        }
        return item
      })
      resolve(res.pageInfo)
    },
  }
};
</script>
<style lang="less" scoped>
.areanoPage {
  width: 100%;
  height: 100%;
  border-radius: 5px;
  padding-top: 15px;
  padding-left: 20px;
  background-color: #fff;

  .el-table__footer-wrapper, .el-table__header-wrapper {
    font-size: 99px;
  }

}
</style>